// application main entry point
Ext.onReady(function() {

	Ext.QuickTips.init();

	Ext.form.Field.prototype.style = {
		textTransform : 'uppercase'
	};

	/*
	 * Inicio de creacion de el Grid de Contratos
	 */
	var xg = Ext.grid;
	// -----------Crea Plugins--------------//

	/*
	 * Crea las acciones a las cuales accesa cada fila
	 */
	var accion = new Ext.ux.grid.RowActions({
				header : 'Acciones',
				autoWidth : true,
				keepSelection : true,
				actions : [{
							iconIndex : 'action1',
							qtipIndex : 'qtip1',
							iconCls : 'icon-undo',
							tooltip : 'Editar'
						}, {
							iconIndex : 'action2',
							qtipIndex : 'qtip2',
							iconCls : 'icon-undo',
							tooltip : 'Acciones'
						}, {
							iconIndex : 'action3',
							qtipIndex : 'qtip3',
							iconCls : 'icon-undo',
							tooltip : 'Descuento'
						}]
			});
	/*
	 * Crea la expansion para ver en detalle cada contrato
	 */
	var expander = new Ext.ux.grid.RowExpander({
		tpl : new Ext.Template(
				'--<br>',
				'<b>Numero Contrato:</b> {TcContrato-numero_contrato}',
				'&nbsp &nbsp &nbsp &nbsp <b>Cantidad Televisores:</b> {TcContrato-cantidad_televisores}',
				'<br/><b>Fecha Instalacion:</b> {TcContrato-fecha_instalacion:date("d-F-Y")}',
				'&nbsp &nbsp &nbsp &nbsp<b>Fecha Reinstalacion:</b> {TcContrato-fecha_reinstalacion:date("d-F-Y")}',
				'&nbsp &nbsp &nbsp &nbsp<b>Fecha Corte:</b> {TcContrato-fecha_corte:date("d-F-Y")}',
				'&nbsp &nbsp &nbsp &nbsp<b>Fecha Cancelacion:</b> {TcContrato-fecha_cancelacion:date("d-F-Y")}',
				'<p><b>Estado:</b> {TcEstadoContrato-descripcion}</p>',
				'<b>Colonia:</b> {MgColonia-descripcion}',
				'&nbsp &nbsp &nbsp &nbsp <b>Casa:</b> {TcContrato-casa}',
				'&nbsp &nbsp &nbsp &nbsp <b>Bloque:</b> {TcContrato-bloque}',
				'<p><b>Descripcion Direccion:</b> {TcContrato-descripcion_direccion}</p>',
				'<p><b>Comentarios:</b> {TcContrato-comentario}</p>--')
	});
	/*
	 * Plugin para la busqueda
	 */
	var busqueda = new Ext.ux.grid.Search({
				mode : 'remote',
				iconCls : true,
				dateFormat : 'm/d/Y',
				minLength : 1,
				width : 250,
				searchText : 'Buscar',
				searchTipText : 'Ingrese los datos a buscar y presione ENTER',
				selectAllText : 'Buscar Todos',
				shortcutKey : 'b',
				shortcutModifier : 'shift'				
			})
	// FIN DE CREAR PLUGINS //


	/*
	 * Trae los datos de la vista de cake agrupados por colonia
	 */
	var ds_cliente = new Ext.data.GroupingStore({
				/*
				 * sortInfo : { field : 'TcEstadoCo-descripcion', direction :
				 * "ASC" },
				 */
				groupField : false,
				proxy : new Ext.data.HttpProxy({
							url : "/cake/syscable/MgClientes/buscacliente"
						}),
				reader : new Ext.data.JsonReader({
							id : 'MgCliente-id',
							root : 'contratos',
							totalProperty : 'total',
							fields : [{
										name : 'MgCliente-id'
									}, {
										name : 'MgCliente-identidad'
									}, {
										name : 'MgCliente-primer_nombre'
									}, {
										name : 'MgCliente-segundo_nombre'
									}, {
										name : 'MgCliente-primer_apellido'
									}, {
										name : 'MgCliente-segundo_apellido'
									},{
										name : 'MgCliente-telefono_residencia'
									}, {
										name : 'MgCliente-telefono_celular'
									}, {
										name : 'MgCliente-telefono_oficina'
									}, {
										name : 'MgCliente-telefono_otro'
									}, {
										name : 'MgCliente-mg_tipo_cliente_id'
									},{
										name : 'MgCliente-fecha_nacimiento',
										type : 'date',
										dateFormat : 'Y-m-d'
									}, {
										name : 'MgCliente-fecha_adicion',
										type : 'date',
										dateFormat : 'Y-m-d'
									}, {
										name : 'MgCliente-referencia'
									}, {
										name : 'MgColonia-correo_electronico'
									},{
										name : 'action1',
										type : 'string'
									}, {
										name : 'action2',
										type : 'string'
									}, {
										name : 'action3',
										type : 'string'
									}, {
										name : 'qtip1',
										type : 'string'
									}, {
										name : 'qtip2',
										type : 'string'
									}, {
										name : 'qtip3',
										type : 'string'
									}]
						}),
				sm : new Ext.grid.RowSelectionModel({
							singleSelect : true,
							listeners : {
								load : {
									scope : xg,
									fn : function() {
										xg.getSelectionModel().selectFirstRow();
									}
								}
							}
						})
			});

	var bbar = new Ext.PagingToolbar({
				pageSize : 12,
				store : ds1,
				displayInfo : true,
				displayMsg : 'Mostrando clientes del {0} - {1} de {2}',
				emptyMsg : 'No hay clientes que mostrar'
			});

	/*
	 * Crea la tabla utilizando los parametros definidos anteriormente
	 */
	var grid_clientes = new xg.GridPanel({
		ds : ds1,
		cm : new xg.ColumnModel({
					defaults : {
						width : 80,
						sortable : true
					},
					columns : [expander, {
								header : "ID",
								dataIndex : 'MgCliente-id',
								hidden : true
							},{
								header : "No. Contrato",
								dataIndex : 'MgCliente-contrato',
								width : 80,
								hidden : false
							}, {
								header : "Estado",
								dataIndex : 'TcEstadoContrato-descripcion',
								width : 80,
								hidden : true
							}, {
								header : "Codigo Cliente",
								dataIndex : 'MgCliente-mg_cliente_id',
								width : 65
							}, {
								header : "Descripcion",
								dataIndex : 'MgCliente-descripcion',
								width : 170
							}, {
								header : "Meses Deuda",
								dataIndex : 'meses_deuda',
								renderer : mes_color,
								width : 55
							}, {
								header : "Colonia",
								dataIndex : 'MgColonia-descripcion'
							}, {
								header : "Fecha Ultimo Pago",
								dataIndex : 'MgCliente-fecha_ultimo_pago_banco',
								renderer : Ext.util.Format
										.dateRenderer('d-F-Y'),
								hidden : false
							}, {
								header : "Ultimo Mes Pago",
								dataIndex : 'MgCliente-fecha_ultimo_pago',
								renderer : Ext.util.Format.dateRenderer('F-Y'),
								hidden : false
							}, {
								header : "Telefono",
								dataIndex : 'MgCliente-telefono',
								hidden : false
							}, accion

					]
				}),
		stripeRows : true,
		view : new Ext.grid.GroupingView({
			enableGrouping : false,
			forceFit : true,
			groupTextTpl : '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Elementos" : "Elemento"]})'
		}),
		columnLines : true,
		width : 850,
		height : 400,
		frame : true,
		bbar : bbar,
		autoScroll : true,

		plugins : [expander, accion, busqueda],
		// title : 'Contratos Detalle',
		iconCls : 'icon-grid'
			// renderTo: 'grid-paging'
	});

	ds_cliente.load({
				params : {
					limit : 12,
					start : 0
				}
			});

	/*
	 * Determina que accion va a realizar cada icono
	 */
	accion.on({
				action : function(grid, record, action, row, col) {
					switch (action) {
						case 'icon-edit-record' :	
						
						var saveData = new Ext.data.Connection().request({
						url : '/cake/syscable/TcContratos/accesoSupervisor',						
						success : function(response) {
							if (Ext.decode(response.responseText).success) {
								ventanaContrato_edit.show(this)
								tabcontratos_edit.setActiveTab(0);
								form_user_edit.getForm().reset();
								dsColoniaEdit.load();
								id_contrato_edit.setValue(record.get('TcContrato-id'));
							    no_contrato_edit.setValue(record.get('TcContrato-contrato'));
							    recibo_contrato_edit.setValue(record.get('TcContrato-numero_contrato'));
								clientes_edit.setValue(record.get('TcContrato-mg_cliente_id')); 
								descripcion_contrato_edit.setValue(record.get('TcContrato-descripcion'));
								cantidad_televisores_edit.setValue(record.get('TcContrato-cantidad_televisores')); 
								instalacion_contrato_edit.setValue(record.get('TcContrato-fecha_instalacion'));
								estado_contrato_edit.setValue(record.get('TcContrato-tc_estado_contrato_id'));
								telefono_contrato_edit.setValue(record.get('TcContrato-telefono'));
								colonias_edit.setValue(record.get('TcContrato-mg_colonia_id'));
								casa_contrato_edit.setValue(record.get('TcContrato-casa'));
								bloque_contrato_edit.setValue(record.get('TcContrato-bloque'));
								estado_contrato_edit.setValue(record.get('TcContrato-tc_estado_contrato_id'));
								calle_contrato_edit.setValue(record.get('TcContrato-calle'));
								descdir_contrato_edit.setValue(record.get('TcContrato-descripcion_direccion'));
							} else {
								Ext.MessageBox.alert('Mensaje',
										'No tiene acceso');
							}							
						},
						failure : function(response) {
							Ext.MessageBox.alert('Message',
									'No tiene acesso para editar contratos!');
						}
					});
					
							
							break;
						case 'icon-error' :
							location.href = "/../../../../cake/syscable/MgDescuentos/mostrar/"
									+ record.get('TcContrato-id');
							break;
						case 'icon-actions' :
							location.href = "/../../../../cake/syscable/TcAcciones/mostrar/"
									+ record.get('TcContrato-id');
							break;
						break;
				}
				}
			});
	gridclientes.on('rowclick', function(grid, rowIndex, e) {
				var selectionModel = gridclientes.getSelectionModel();
				var record = selectionModel.getSelected();
				var contratovalue = record.get('TcContrato-id');
				ds1.baseParams['contratoid'] = contratovalue;
				ds1.load({
							params : {
								limit : 5,
								start : 0
							}
						});
			});

	/*
	 * Incio de la Creacion del Grid del Historial
	 */
	var xg1 = Ext.grid;

	var accionhist = new Ext.ux.grid.RowActions({
				header : 'Reversar',
				autoWidth : false,
				width : 60,
				keepSelection : true,
				actions : [{
							iconIndex : 'action1',
							qtipIndex : 'qtip1',
							iconCls : 'icon-undo',
							tooltip : 'Reversar'
						}]
			});

	/*
	 * Trae los datos de la vista de cake agrupados por colonia
	 */
	var ds1 = new Ext.data.Store({
		proxy : new Ext.data.HttpProxy({
					url : "/cake/syscable/TcMovimientosDiarios/historialext"
				}),
		reader : new Ext.data.JsonReader({
					id : 'TcMovimientosDiario-id',
					root : 'historial',
					totalProperty : 'total',
					fields : [{
								name : 'TcMovimientosDiario-id'
							}, {
								name : 'TcContrato-contrato'
							}, {
								name : 'TcMovimientosDiario-tc_contrato_id'
							}, {
								name : 'MgAgente-descripcion'
							}, {
								name : 'MgDocumento-codigo_referencia'
							}, {
								name : 'TcMovimientosDiario-mg_tipo_situacione_id'
							}, {
								name : 'TcMovimientosDiario-descripcion'
							}, {
								name : 'TcMovimientosDiario-valor_pagado'
							}, {
								name : 'TcMovimientosDiario-fecha_referencia',
								type : 'date',
								dateFormat : 'Y-m-d'
							}, {
								name : 'TcMovimientosDiario-codo'
							}, {
								name : 'TcMovimientosDiario-pago_mes_inicial',
								type : 'date',
								dateFormat : 'Y-m-d'
							}, {
								name : 'TcMovimientosDiario-pago_mes_final',
								type : 'date',
								dateFormat : 'Y-m-d'
							}, {
								name : 'TcMovimientosDiario-adicionado_por'
							}, {
								name : 'TcMovimientosDiario-created',
								type : 'date',
								dateFormat : 'Y-m-d'
							}, {
								name : 'action1',
								type : 'string'
							}, {
								name : 'qtip1',
								type : 'string'
							}]
				}),
		sm : new Ext.grid.RowSelectionModel({
					singleSelect : true,
					listeners : {
						load : {
							scope : xg1,
							fn : function() {
								xg.getSelectionModel().selectFirstRow();
							}
						}
					}
				})
	});
	/*
	 * Crea la tabla utilizando los parametros definidos anteriormente
	 */
	var tbar = new Ext.PagingToolbar({
				pageSize : 5,
				store : ds1,
				displayInfo : true,
				displayMsg : 'Mostrando Movimientos del {0} - {1} de {2}',
				emptyMsg : 'No hay Movimientos que mostrar'
			});

	var gridhistorialcontratos = new xg.GridPanel({
		ds : ds1,
		trackMouseOver : false,
		cm : new xg1.ColumnModel({
			defaults : {
				width : 80,
				sortable : true
			},
			columns : [{
						header : "ID",
						dataIndex : 'TcMovimientosDiario-id',
						hidden : true
					}, {
						header : "No. Contrato",
						dataIndex : 'TcContrato-contrato',
						width : 70,
						hidden : false
					}, {
						header : "Agente",
						dataIndex : 'MgAgente-descripcion',
						width : 70
					}, {
						header : "Id Contrato",
						dataIndex : 'TcMovimientosDiario-tc_contrato_id',
						width : 70,
						hidden : true
					}, {
						header : "Situacion",
						dataIndex : 'TcMovimientosDiario-mg_tipo_situacione_id',
						width : 65,
						hidden : true
					}, {
						header : "Documento",
						dataIndex : 'MgDocumento-codigo_referencia',
						width : 60
					}, {
						header : "Descripcion",
						dataIndex : 'TcMovimientosDiario-descripcion',
						width : 150
					}, {
						header : "Valor",
						dataIndex : 'TcMovimientosDiario-valor_pagado',
						width : 45
					}, {
						header : "Fecha Referencia",
						dataIndex : 'TcMovimientosDiario-fecha_referencia',
						renderer : Ext.util.Format.dateRenderer('d-F-Y')
					}, {
						header : "codo",
						dataIndex : 'TcMovimientosDiario-codo',
						width : 40
					}, {
						header : "Pago Inicial",
						dataIndex : 'TcMovimientosDiario-pago_mes_inicial',
						renderer : Ext.util.Format.dateRenderer('F-Y')
					}, {
						header : "Pago Final",
						dataIndex : 'TcMovimientosDiario-pago_mes_final',
						renderer : Ext.util.Format.dateRenderer('F-Y')
					}, {
						header : "Adicionado por",
						dataIndex : 'TcMovimientosDiario-adicionado_por'
					}, {
						header : "Creado",
						dataIndex : 'TcMovimientosDiario-created',
						renderer : Ext.util.Format.dateRenderer('d-F-Y')
					}, accionhist]
		}),
		stripeRows : true,
		columnLines : true,
		width : 850,
		height : 200,
		frame : false,
		plugins : [accionhist],
		tbar : tbar,
		title : 'Historial',
		iconCls : 'icon-grid',
		view : new Ext.grid.GridView({
					getRowClass : function(row, index) {
						if (!row) {
							return ''
						}
						if (row
								.get('TcMovimientosDiario-mg_tipo_situacione_id') == 2) {
							return 'red-row'
						}
					}
				})
	});
	accionhist.on({
		action : function(grid, record, action, row, col) {
			switch (action) {
				case 'icon-undo' :
					var saveData = new Ext.data.Connection().request({
						url : '/cake/syscable/TcMovimientosDiarios/reversionExt',
						params : {
							mov_id : record.get('TcMovimientosDiario-id')
							// ,contrato_id:
							// record.get('TcMovimientosDiario-tc_contrato_id')
						},
						success : function(response) {

							if (Ext.decode(response.responseText).success) {
								Ext.MessageBox.alert('Mensaje',
										'Reversion Realizada Exitosamente');
							} else {
								Ext.MessageBox.alert('Mensaje',
										'Reversion Realizada Exitosamente');
							}

							ds1.baseParams['contratoid'] = record
									.get('TcMovimientosDiario-tc_contrato_id');
							ds1.load({
										params : {
											limit : 5,
											start : 0
										}
									});
						},
						failure : function(response) {
							Ext.MessageBox.alert('Message',
									'ERROR no se reverso el movimiento!');
							ds1.baseParams['contratoid'] = record
									.get('TcMovimientosDiario-tc_contrato_id');
							ds1.load({
										params : {
											limit : 5,
											start : 0
										}
									});
						}
					});
					break;
				break;
		}
		}
	});

	/*
	 * Crea Ventana para el ingreso de contratos
	 */

	var dsColonia = new Ext.data.Store({
				proxy : new Ext.data.HttpProxy({
							url : "/cake/syscable/TcContratos/combobox/1/MgColonia"
						}),
				reader : new Ext.data.JsonReader({
							id : 'id',
							root : 'datos',
							totalProperty : 'total',
							fields : [{
										name : 'id'
									}, {
										name : 'descripcion'
									}]
						})

			});
			
		var dsColoniaEdit = new Ext.data.Store({
				proxy : new Ext.data.HttpProxy({
							url : "/cake/syscable/TcContratos/combobox/1/MgColonia"
						}),
				reader : new Ext.data.JsonReader({
							id : 'id',
							root : 'datos',
							totalProperty : 'total',
							fields : [{
										name : 'id'
									}, {
										name : 'descripcion'
									}]
						})

			});
			
	var dsClientes = new Ext.data.Store({
				proxy : new Ext.data.HttpProxy({
							url : "/cake/syscable/TcContratos/combobox/2/MgCliente"
						}),
				reader : new Ext.data.JsonReader({
							id : 'id',
							root : 'datos',
							totalProperty : 'total',
							fields : [{
										name : 'id'
									}, {
										name : 'primer_nombre'
									}, {
										name : 'segundo_nombre'
									}, {
										name : 'primer_apellido'
									}, {
										name : 'segundo_apellido'
									}]
						})

			});

	var resultadoTpl = new Ext.XTemplate('<tpl for="."><div class="x-combo-list-item"><b>{id}</b>--{primer_nombre} {primer_apellido}</div></tpl>');
	/*
	 * var resultTpl = new Ext.XTemplate( '<tpl for="."><div
	 * class="search-item">', '<h3><span>{lastPost:date("M j, Y")}<br />by
	 * {author}</span>{title}</h3>', '{excerpt}', '</div></tpl>' );
	 */

	var colonias = new Ext.form.ComboBox({
				store : dsColonia,
				mode : 'local',
				displayField : 'descripcion',
				valueField : 'id',
				typeAhead : true,
				loadingText : 'Buscando...',
				fieldLabel : 'Colonia',
				hiddenName : 'data[TcContrato][mg_colonia_id]',
				triggerAction : 'all',
				allowBlank : false,
				emptyText : 'Escoja una colonia...',
				forceSelection : true,
				selectOnFocus : true,
				width : 190,
				listEmptyText : 'No hay resultados',
				minChars : 2,
				lazyRender : true

			});
	var clientes = new Ext.form.ComboBox({
				store : dsClientes,
				mode : 'remote',
				displayField : 'id',
				valueField : 'id',
				typeAhead : true,
				tpl : resultadoTpl,
				loadingText : 'Buscando...',
				valueNotFound : 123,
				fieldLabel : 'Cliente',
				// pageSize:10,
				hiddenName : 'data[TcContrato][mg_cliente_id]',
				triggerAction : 'all',
				allowBlank : false,
				emptyText : 'Elija un cliente...',
				forceSelection : true,
				selectOnFocus : true,
				width : 190,
				listEmptyText : 'No hay resultados',
				minChars : 2,
				lazyRender : true,
				blankText : 'No puede estar vacio'

			});

	var cantidad_televisores = new Ext.form.NumberField({
				name : 'data[TcContrato][cantidad_televisores]', // field
				fieldLabel : 'No. TVs', // label text
				value : 2,
				hidden : false,
				allowBlank : false,
				blankText : 'No puede estar vacio',
				minText : 'La cantidad minima de televisores es 2',
				maxText : 'La cantidad maxima de televisores es 20',
				// type: number,
				minValue : 2,
				maxValue : 20

			});
	var descripcion_contrato = new Ext.form.TextField({
				fieldLabel : 'Descripcion',
				name : 'data[TcContrato][descripcion]',
				allowBlank : false,
				id : 'cliente_descripcion',
				blankText : 'No puede estar vacio'
			});

	var tabcontratos = new Ext.TabPanel({
		layoutOnTabChange : true,
		// activeTab : 0,
		defaults : {
			autoHeight : true,
			bodyStyle : 'padding:10px',
			width : 400
		},
		items : [{
			title : 'Datos Generales',
			layout : 'form',
			shadow : true,
			defaults : {
				width : 300
			},
			tabTip : 'Datos generales del contrato',
			items : [new Ext.form.TextField({
								id : 'idcontratoext',
								fieldLabel : 'No. Contrato',
								name : 'data[TcContrato][contrato]', // field
								allowBlank : false,
								blankText : 'No puede estar vacio'
							}), new Ext.form.TextField({
								fieldLabel : 'No. Recibo', // label text
								name : 'data[TcContrato][numero_contrato]',
								allowBlank : false,
								blankText : 'No puede estar vacio'
							}), clientes, descripcion_contrato,
					cantidad_televisores, new Ext.form.TextArea({
								fieldLabel : 'Comentarios',
								name : 'data[TcContrato][comentario]',
								height : 100
							}), new Ext.form.DateField({
								fieldLabel : 'Fecha Instalacion',
								labelWidth : 110,
								name : 'data[TcContrato][fecha_instalacion]',
								width : 190,
								allowBlank : true,
								format : 'd-m-Y',
								todayText : 'Hoy'
							}), new Ext.form.TextField({
								name : 'data[TcContrato][tc_estado_contrato_id]',
								hidden : true,
								value : 1
							}), new Ext.form.TextField({
								name : 'data[TcContrato][tc_tipo_contrato_id]',
								hidden : true,
								value : 1
							})],
			buttons : [{
						iconCls : 'icon-right',
						scale : 'large',
						width : 32,
						height : 32,
						cls : 'boton_align_right',
						handler : function() {
							tabcontratos.setActiveTab(1);

						}
					}]
		}, {
			title : 'Direccion',
			layout : 'form',
			buttons : [{
						iconCls : 'icon-left',
						scale : 'large',
						width : 32,
						height : 32,
						cls : 'boton_align_left',
						handler : function() {
							tabcontratos.setActiveTab(0);

						}
					}, {
						text : 'Guardar',
						type : 'submit',
						handler : function() {
							form_user.form.submit({
										waitTitle : 'Guardando Datos',
										waitMsg : 'Porfavor Espere',
										url : '/cake/syscable/TcContratos/insertarExt',
										success : function(form,action) {
											Ext.MessageBox
													.alert(
															'Mensaje',
															'Contrato Guardado Exitosamente!',
															function() {
																form_user
																		.getForm()
																		.reset();
																ventanaContrato
																		.hide(this)
																form_user_reajuste.getForm().reset();
																id_contrato_reajuste.setValue(action.result.contrato)
																
																ventanaReajuste.show();
																
																		
															});
										},
										failure : function() {
											Ext.MessageBox.alert('Mensaje',
													'Error al Guardar!');
										}
									});
						}
					}, {
						text : 'Cancelar',
						handler : function() {
							form_user.getForm().reset();
							ventanaContrato.hide(this);
						}
					}],
			defaults : {
				width : 300
			},
			items : [new Ext.form.TextField({
						fieldLabel : 'Telefono',
						name : 'data[TcContrato][telefono]',
						allowBlank : false,
						blankText : 'No puede estar vacio'
							// plugins: [new
							// Ext.ux.InputTextMask('9999-9999', false)]
						}), colonias, new Ext.form.TextField({
								fieldLabel : 'Casa',
								name : 'data[TcContrato][casa]',
								allowBlank : true,
								blankText : 'No puede estar vacio'
							}), new Ext.form.TextField({
								fieldLabel : 'Bloque',
								name : 'data[TcContrato][bloque]',
								allowBlank : true,
								blankText : 'No puede estar vacio'
							}), new Ext.form.TextField({
								fieldLabel : 'Calle',
								name : 'data[TcContrato][calle]',
								allowBlank : true,
								blankText : 'No puede estar vacio'
							}), new Ext.form.TextArea({
								fieldLabel : 'Descripcion Direccion',
								name : 'data[TcContrato][descripcion_direccion]',
								allowBlank : false,
								blankText : 'No puede estar vacio',
								height : 100
							})]
		}]
	})
	var form_user = new Ext.form.FormPanel({
				frame : false,
				// activeItem : 'idcontratoext',
				bodyStyle : 'padding: 5px 5px 0',
				width : 550,
				trackResetOnLoad : true,
				labelWidth : 90,
				labelAlign : 'right',
				defaultType : 'textfield',
				items : [tabcontratos]
			});

	var ventanaContrato = new Ext.Window({
				id : 'simplestbl',
				layout : 'border',
				closable : true,
				closeAction : 'hide',
				width : 550,
				applyTo : 'forma-paging',
				height : 380,
				plain : false,
				maximizable : false,
				resizable : false,
				// modal: true,
				title : 'Insertar Contrato',
				frame : true,
				items : [{
							region : 'center',
							width : 200,
							layout : 'fit',
							frame : false,
							border : false,
							items : [form_user]
						}]
			});
	/*
	 * Crea forma para el ingreso de clientes naturales
	 */

	var tabclientes = new Ext.TabPanel({
		// layoutOnTabChange : true,
		// activeTab : 0,
		defaults : {
			autoHeight : true,
			bodyStyle : 'padding:10px',
			width : 400
		},
		items : [{
			title : 'Datos Generales',
			layout : 'form',
			shadow : true,
			defaults : {
				width : 300
			},
			tabTip : 'Datos generales del cliente',
			items : [new Ext.form.TextField({
						id : 'idclienteext',
						fieldLabel : 'Identidad',
						name : 'data[MgCliente][identidad]',
						allowBlank : false,
						blankText : 'No puede estar vacio',
						plugins : [new Ext.ux.InputTextMask('9999-9999-99999',
								true)]
					}), new Ext.form.TextField({
						fieldLabel : 'Primer Nombre', // label text
						name : 'data[MgCliente][primer_nombre]',
						allowBlank : false,
						blankText : 'No puede estar vacio'
					}), new Ext.form.TextField({
						fieldLabel : 'Segundo Nombre',
						name : 'data[MgCliente][segundo_nombre]',
						allowBlank : true
					}), new Ext.form.TextField({
						fieldLabel : 'Primer Apellido',
						name : 'data[MgCliente][primer_apellido]',
						allowBlank : false,
						blankText : 'No puede estar vacio'
					}), new Ext.form.TextField({
						fieldLabel : 'Segundo Apellido',
						name : 'data[MgCliente][segundo_apellido]',
						allowBlank : true
					}), new Ext.form.DateField({
						fieldLabel : 'Fecha de Nacimiento',
						labelWidth : 110,
						name : 'data[MgCliente][fecha_nacimiento]',
						width : 190,
						allowBlank : true,
						format : 'd-m-Y',
						todayText : 'Hoy'
					}), new Ext.form.TextField({
						// fieldLabel : 'Tipo Cliente', // label text
						name : 'data[MgCliente][mg_tipo_cliente_id]',
						value : 1,
						hidden : true
					})],
			buttons : [{
						iconCls : 'icon-right',
						scale : 'large',
						width : 32,
						height : 32,
						// cls: 'boton_align_right',
						handler : function() {
							tabclientes.setActiveTab(1);

						}
					}]
		}, {
			title : 'Contactos',
			layout : 'form',
			defaults : {
				width : 300
			},
			items : [new Ext.form.TextField({
								fieldLabel : 'Celular',
								name : 'data[MgCliente][telefono_celular]',
								allowBlank : true,
								blankText : 'No puede estar vacio'
							}), new Ext.form.TextField({
								fieldLabel : 'Telefono Residencia',
								name : 'data[MgCliente][telefono_residencia]',
								allowBlank : true,
								blankText : 'No puede estar vacio'
							}), new Ext.form.TextField({
								fieldLabel : 'Telefono Oficina',
								name : 'data[MgCliente][telefono_oficina]',
								allowBlank : true,
								blankText : 'No puede estar vacio'
							}), new Ext.form.TextField({
								fieldLabel : 'Telefono Otro',
								name : 'data[MgCliente][telefono_otro]',
								allowBlank : true,
								blankText : 'No puede estar vacio'
							}), new Ext.form.TextField({
								fieldLabel : 'Correo Electronico',
								name : 'data[MgCliente][correo_electronico]',
								allowBlank : true,
								blankText : 'No puede estar vacio'
							}), new Ext.form.TextArea({
								fieldLabel : 'Referencia',
								name : 'data[MgCliente][referencia]',
								allowBlank : true,
								blankText : 'No puede estar vacio',
								height : 90
							})],
			buttons : [{
						iconCls : 'icon-left',
						scale : 'large',
						width : 32,
						height : 32,
						cls : 'boton_align_left',
						handler : function() {
							tabclientes.setActiveTab(0);

						}
					}, {
						text : 'Guardar',
						type : 'submit',
						handler : function() {
							form_clientes.form.submit({
								timeout : 350,
								waitMsg : 'Porfavor Espere',
								waitTitle : 'Guardando Datos',
								url : '/cake/syscable/MgClientes/insertarExt',
								success : function(form, action) {
									Ext.MessageBox.alert('Mensaje',
											'Cliente Guardado Exitosamente!',
											function() {
												ventana_cliente.hide(this);
												form_clientes.getForm().reset();
												ventanaContrato.show(this);
												tabcontratos.setActiveTab(0);
												form_user.getForm().reset();
												dsColonia.load();
												descripcion_contrato
														.setValue(action.result.nombre_cliente);
												clientes
														.setValue(action.result.clienteid)
											});
								},
								failure : function() {
									Ext.MessageBox.alert('Mensaje',
											'Error al Guardar!');
								}
							});
						}
					}, {
						text : 'Cancelar',
						handler : function() {
							form_clientes.getForm().reset();
							ventana_cliente.hide(this);
						}
					}]
		}]
	})

	var form_clientes = new Ext.form.FormPanel({
				frame : false,
				trackResetOnLoad : true,
				activeItem : 'idcontratoext',
				bodyStyle : 'padding: 5px 5px 0',
				width : 550,
				labelWidth : 125,
				labelAlign : 'right',
				defaultType : 'textfield',
				items : [tabclientes]
			});

	var ventana_cliente = new Ext.Window({
				id : 'simplestbl',
				layout : 'border',
				closable : true,
				closeAction : 'hide',
				width : 550,
				applyTo : 'clientes-paging',
				height : 365,
				plain : false,
				maximizable : false,
				resizable : false,
				title : 'Insertar Cliente',
				frame : true,
				items : [{
							region : 'center',
							width : 200,
							layout : 'fit',
							frame : false,
							border : false,
							items : [form_clientes]
						}]
			});
	/*
	 * Crea Ventana para Edicion de contratos
	 */
   
	/*
	 * Inicio Campos que se utilizaran en la forma
	 */		
	var colonias_edit = new Ext.form.ComboBox({
				store : dsColoniaEdit,
				mode : 'local',
				displayField : 'descripcion',
				valueField : 'id',
				typeAhead : true,
				loadingText : 'Buscando...',
				fieldLabel : 'Colonia',
				hiddenName : 'data[TcContrato][mg_colonia_id]',
				triggerAction : 'all',
				allowBlank : false,
				emptyText : 'Escoja una colonia...',
				forceSelection : true,
				selectOnFocus : true,
				width : 190,
				listEmptyText : 'No hay resultados',
				minChars : 2
				//lazyRender : true
			});
	var clientes_edit = new Ext.form.ComboBox({
				store : dsClientes,
				mode : 'remote',
				displayField : 'id',
				valueField : 'id',
				typeAhead : true,
				tpl : resultadoTpl,
				loadingText : 'Buscando...',
				valueNotFound : 123,
				fieldLabel : 'Cliente',
				// pageSize:10,
				hiddenName : 'data[TcContrato][mg_cliente_id]',
				triggerAction : 'all',
				allowBlank : false,
				emptyText : 'Elija un cliente...',
				forceSelection : true,
				selectOnFocus : true,
				width : 190,
				listEmptyText : 'No hay resultados',
				minChars : 2,
				lazyRender : true,
				blankText : 'No puede estar vacio'

			});

	var cantidad_televisores_edit = new Ext.form.NumberField({
				name : 'data[TcContrato][cantidad_televisores]', // field
				fieldLabel : 'No. TVs', // label text
				value : 2,
				hidden : false,
				allowBlank : false,
				blankText : 'No puede estar vacio',
				minText : 'La cantidad minima de televisores es 2',
				maxText : 'La cantidad maxima de televisores es 20',
				// type: number,
				minValue : 2,
				maxValue : 20

			});
	var descripcion_contrato_edit = new Ext.form.TextField({
				fieldLabel : 'Descripcion',
				name : 'data[TcContrato][descripcion]',
				allowBlank : false,
				id : 'cliente_descripcion',
				blankText : 'No puede estar vacio'
			});
	var id_contrato_edit = new Ext.form.TextField({
				//fieldLabel : 'ID',
				name : 'data[TcContrato][id]',
				hidden : true
			});
	var no_contrato_edit = new Ext.form.TextField({
				fieldLabel : 'No. Contrato',
				name : 'data[TcContrato][contrato]',
				allowBlank : false,
				blankText : 'No puede estar vacio'
			});
	var recibo_contrato_edit = new Ext.form.TextField({
				fieldLabel : 'No. Recibo', // label text
				name : 'data[TcContrato][numero_contrato]',
				allowBlank : false,
				blankText : 'No puede estar vacio'
			});
	var comentario_contrato_edit = new Ext.form.TextArea({
				fieldLabel : 'Comentarios',
				name : 'data[TcContrato][comentario]',
				height : 100
			});
	var instalacion_contrato_edit = new Ext.form.DateField({
				fieldLabel : 'Fecha Instalacion',
				labelWidth : 110,
				name : 'data[TcContrato][fecha_instalacion]',
				width : 190,
				allowBlank : true,
				format : 'd-m-Y',
				todayText : 'Hoy'
			});
	var estado_contrato_edit = new Ext.form.TextField({
				name : 'data[TcContrato][tc_estado_contrato_id]',
				hidden : true
				//value : 1
			});
	var telefono_contrato_edit = new Ext.form.TextField({
				fieldLabel : 'Telefono',
				name : 'data[TcContrato][telefono]',
				allowBlank : false,
				blankText : 'No puede estar vacio'
			});
	var casa_contrato_edit = new Ext.form.TextField({
				fieldLabel : 'Casa',
				name : 'data[TcContrato][casa]',
				allowBlank : true,
				blankText : 'No puede estar vacio'
			});
	var bloque_contrato_edit = new Ext.form.TextField({
				fieldLabel : 'Bloque',
				name : 'data[TcContrato][bloque]',
				allowBlank : true,
				blankText : 'No puede estar vacio'
			});
	var calle_contrato_edit = new Ext.form.TextField({
				fieldLabel : 'Calle',
				name : 'data[TcContrato][calle]',
				allowBlank : true,
				blankText : 'No puede estar vacio'
			});
	var descdir_contrato_edit = new Ext.form.TextArea({
				fieldLabel : 'Descripcion Direccion',
				name : 'data[TcContrato][descripcion_direccion]',
				allowBlank : false,
				blankText : 'No puede estar vacio',
				height : 100
			})

	/*
	 * Fin Campos que se utilizaran en la forma
	 */		
	var tabcontratos_edit = new Ext.TabPanel({
		defaults : {
			autoHeight : true,
			bodyStyle : 'padding:10px',
			width : 400
		},
		items : [{
			title : 'Datos Generales',
			layout : 'form',
			shadow : true,
			defaults : {
				width : 300
			},
			tabTip : 'Datos generales del contrato',
			items : [id_contrato_edit, no_contrato_edit, recibo_contrato_edit,
					clientes_edit, descripcion_contrato_edit,
					cantidad_televisores_edit, instalacion_contrato_edit,
					estado_contrato_edit],
			buttons : [{
						iconCls : 'icon-right',
						scale : 'large',
						width : 32,
						height : 32,
						cls : 'boton_align_right',
						handler : function() {
							tabcontratos_edit.setActiveTab(1);

						}
					}]
		}, {
			title : 'Direccion',
			layout : 'form',
			buttons : [{
						iconCls : 'icon-left',
						scale : 'large',
						width : 32,
						height : 32,
						cls : 'boton_align_left',
						handler : function() {
							tabcontratos_edit.setActiveTab(0);

						}
					}, {
						text : 'Guardar',
						type : 'submit',
						handler : function() {
							form_user_edit.form.submit({
										waitTitle : 'Guardando Datos',
										waitMsg : 'Porfavor Espere',
										url : '/cake/syscable/TcContratos/editExt',
										success : function() {
											Ext.MessageBox
													.alert(
															'Mensaje',
															'Contrato Guardado Exitosamente!',
															function() {
																form_user_edit
																		.getForm()
																		.reset();
																ventanaContrato_edit
																		.hide(this);
																ds_cliente.load();		
															});
										},
										failure : function() {
											Ext.MessageBox.alert('Mensaje',
													'Error al Guardar!');
										}
									});
						}
					}, {
						text : 'Cancelar',
						handler : function() {
							form_user_edit.getForm().reset();
							ventanaContrato_edit.hide(this);
						}
					}],
			defaults : {
				width : 300
			},
			items : [telefono_contrato_edit, colonias_edit, casa_contrato_edit,
					bloque_contrato_edit, calle_contrato_edit,descdir_contrato_edit]
		}]
	})
	var form_user_edit = new Ext.form.FormPanel({
				frame : false,
				// activeItem : 'idcontratoext',
				bodyStyle : 'padding: 5px 5px 0',
				width : 550,
				trackResetOnLoad : true,
				labelWidth : 90,
				labelAlign : 'right',
				defaultType : 'textfield',
				items : [tabcontratos_edit]
			});

	var ventanaContrato_edit = new Ext.Window({
				id : 'w_contrato',
				layout : 'border',
				closable : true,
				closeAction : 'hide',
				width : 550,
				applyTo : 'edit-paging',
				height : 380,
				plain : false,
				maximizable : false,
				resizable : false,
				// modal: true,
				title : 'Insertar Contrato',
				frame : true,
				items : [{
							region : 'center',
							width : 200,
							layout : 'fit',
							frame : false,
							border : false,
							items : [form_user_edit]
						}]
			});

	/*
	 * Crea ventana para reajuste 
	 */

		
	var valor_pagado = new Ext.form.NumberField({
				name : 'data[TcMovimientosDiario][valor_pagadox]', // field
				fieldLabel : 'Reajuste', // label text				
				hidden : false,
				allowBlank : false,
				blankText : 'No puede estar vacio'
			});
	var meses_pagado = new Ext.form.NumberField({				
				hidden: true,
				name : 'data[TcMovimientosDiario][meses_pagados]',
				allowBlank : false,				
				blankText : 'No puede estar vacio',
				value: 1
			});
	var id_contrato_reajuste = new Ext.form.TextField({	
				fieldLabel : 'Contrato',
				name : 'data[TcMovimientosDiario][contrato]',
				hidden : false,
				readOnly: true,
				width: 300,
				allowBlank: false
			});
	var fecha_referencia = new Ext.form.DateField({
				fieldLabel : 'Fecha Pago',
				labelWidth : 110,
				name : 'data[TcMovimientosDiario][fecha_referencia]',
				width : 190,
				allowBlank : false,
				format : 'd-m-Y',
				todayText : 'Hoy'
			});	
	
	var form_user_reajuste = new Ext.form.FormPanel({
				frame : true,
				// activeItem : 'idcontratoext',
				bodyStyle : 'padding: 5px 5px 0',
				width : 450,
				trackResetOnLoad : true,
				labelWidth : 90,
				labelAlign : 'right',
				defaultType : 'textfield',
				items : [id_contrato_reajuste,fecha_referencia,valor_pagado]
			});

	var ventanaReajuste = new Ext.Window({
				id : 'w_reajuste',
				layout : 'border',
				closable : true,
				closeAction : 'hide',
				width : 450,
				applyTo : 'reajuste-paging',
				height : 200,
				plain : false,
				maximizable : false,
				resizable : false,				
				buttons : [{
						text : 'Pagar',
						type : 'submit',
						handler : function() {
							form_user_reajuste.form.submit({
										waitTitle : 'Realizando Pago',
										waitMsg : 'Porfavor Espere',
										url : '/cake/syscable/TcMovimientosDiarios/ingresoExt',
										success : function() {
											Ext.MessageBox
													.alert(
															'Mensaje',
															'Pago Realizado Exitosamente!',
															function() {
																form_user_reajuste
																		.getForm()
																		.reset();
																ventanaReajuste
																		.hide(this);
																ds_cliente.load();		
															});
										},
										failure : function() {
											Ext.MessageBox.alert('Mensaje',
													'Error al Guardar!');
										}
									});
						}
					}/*, {
						text : 'Cancelar',
						handler : function() {
							form_user_reajuste.getForm().reset();
							ventanaReajuste.hide(this);
						}
					}*/],
				// modal: true,
				title : 'Pago de Reajuste',
				frame : true,
				items : [{
							region : 'center',
							width : 450,
							layout : 'fit',
							frame : true,
							border :true,
							items : [form_user_reajuste]
						}]
			});
		
			
	/*
	 * Panel que muestra todo el contenido
	 */
	var panel = new Ext.Panel({
				title : 'Contatos Detalle',
				id : 'detcontrato',
				layout : 'border',
				width : 950,
				height : 600,
				frame : true,
				renderTo : 'grid-paging',
				items : [{
							region : 'center',
							width : 200,
							layout : 'fit',
							frame : false,
							border : false,
							items : [gridclientes]
						}, {
							region : 'south',
							layout : 'fit',
							frame : false,
							border : true,
							width : 400,
							height : 200,
							split : true,
							collapsible : true,
							items : [gridhistorialcontratos],
							collapseMode : 'mini'
						}],
				tbar : [{ // Inline toolbars: Top bar
					text : 'Agregar Cliente Y Contrato',
					tooltip : 'Agregar un Cliente y luego un Contrato',
					iconCls : 'icon-plus',
					handler : function() {
						ventana_cliente.show(this)
						tabclientes.setActiveTab(0);
						form_clientes.getForm().reset();
					}
				}, '-', {
					text : 'Agregar Contrato',
					tooltip : 'Agregar un Contrato',
					iconCls : 'icon-plus',
					handler : function() {
						ventanaContrato.show(this)
						tabcontratos.setActiveTab(0);
						form_user.getForm().reset();
						dsColonia.load();
					}
				}]
			});
	gridclientes.getView().refresh();
}); // eo function onReady
